@import '../../containers/Application/colors.scss';

.tooltipContainer {
    display: inline-block;
    background: none;
    border: none;
}

.tooltip {
    background: $black;
    border-radius: 3px;
    color: $white;
    font-weight: 600;
    font-size: 10px;
    line-height: 14px;
    padding: 3px 7px 3px;
}

.top {
    position: relative;

    &::before {
        content: '';
        position: absolute;
        top: 100%;
        left: 50%;
        margin-left: -6px;
        border-width: 4px 6px 0 6px;
        border-style: solid;
        border-color: $black transparent transparent transparent;
    }
}

.bottom {
    position: relative;

    &::before {
        content: '';
        position: absolute;
        top: -4px;
        left: 50%;
        margin-left: -6px;
        border-width: 0 6px 4px 6px;
        border-style: solid;
        border-color: transparent transparent $black transparent;
    }
}
